<section class="tile cornered">
    <div class="tile-header">
        <h4><i class="fa fa-user"></i>会员到期情况 <a
                title="人数计算规则是客户数，时间是2016年到现在。三月内到期的数量包含二月内到期的数量，二月内到期的数量包含一月内到期的数量">说明</a>
        </h4>
    </div>
    <div class="tile-body" style="height: 300px;">
        <div class='col-md-12'>
            <div id="canvasHyDiv" style="height: 300px;width:100%;">
            </div>
        </div>
    </div>
</section>
<script>
    //过期客户图表
    $(function () {
        var myCharts = echarts.init(document.getElementById("canvasHyDiv"));
        $.ajax({
            url: '${absoluteContextPath}/ajaxCustomerState',
            type: 'post',
            success: function (data) {
                var data = JSON.parse(data);
                console.info(data);
                var options = {
                    tooltip: {
                        trigger: 'axis'

                    },
                    grid: {
                        x: '12%',
                        y: '6%',
                        width: '90%',
                    },
                    calculable: true,
                    xAxis: [
                        {
                            type: 'category',
                            data: ['有效客户', '一月内到期', '二月内到期', '三月内到期', '过期客户']
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value',
                            axisLabel: {
                                formatter: '{value} 人'
                            }
                        }
                    ],
                    series: [
                        {
                            name: '客户数量',
                            type: 'bar',
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true,
                                        position: 'top',
                                        textStyle: {color: '#000000'}

                                    }
                                }
                            },
                            data: [data.content[0], data.content[1], data.content[2], data.content[3], data.content[4]],
                        }
                    ]
                };
                myCharts.setOption(options);
                myCharts.on(echarts.config.EVENT.CLICK, eConsole1);
            }
        });
    });

    function eConsole1(param) {
        $(" #Form_Customer  input[name='overdueType']").val(param.dataIndex);
        $("#Form_Customer").submit();
    }
</script>